<template>
  <view style="margin: 20rpx 0; ">
    <!-- 收支碳能量数量-->
    <uni-card :is-shadow="false">
      <template v-if="dataDetails.inOutType == 0">
        <span style="margin-right: 15rpx;">支出碳能量：</span>
        <span class="common-money errorColor" style="">{{ dataDetails.amount }}</span>&nbsp;g
      </template>
      <template v-else>
        <span style="margin-right: 15rpx;">获得碳能量：</span>
        <span class="common-money themeColor">{{ dataDetails.amount }}</span>&nbsp;g
      </template>
    </uni-card>

    <!-- 基本信息-->
    <uni-card title="基本信息" :is-shadow="false">
      <view>交易编号：<span>{{ dataDetails.number }}</span></view>
      <view>交易名称：<span>{{ dataDetails.name }}</span></view>
      <view> 收支类型：
        <template v-for="(item, index) in dicts.ec_change_type">
          <template v-if="dataDetails.inOutType == item.value">
            <uni-tag size="small" :text="item.text" :type="item.type"/>
          </template>
        </template>
      </view>
      <view>交易渠道：
        <template v-for="(item, index) in dicts.ec_integral_trading_channel">
          <template v-if="dataDetails.channel == item.value">
            <span>{{ item.text }}</span>
          </template>
        </template>
      </view>
      <view>收支数量：
        <span v-if="dataDetails.inOutType == 0" class="errorColor">- {{ dataDetails.amount }} g 碳能量</span>
        <span v-else class="themeColor">+ {{ dataDetails.amount }} g 碳能量</span>
      </view>
      <view>碳能量余额：<span>{{ dataDetails.balance }} g 碳能量</span></view>
      <view>支付人：<span>{{ dataDetails.payerName }}</span></view>
      <view>交易时间：<span>{{ dataDetails.createTime }}</span></view>
      <view>描述：{{ dataDetails.remark }}</view>
    </uni-card>

    <!-- 关联企业信息-->
    <uni-card v-if="!!company" title="关联企业信息" :is-shadow="false">
      <view>企业名称：<span>{{ company.name }}</span></view>
      <view>信用代码：<span>{{ company.creditCode }}</span></view>
      <view>法人名称：<span>{{ company.leader }}</span></view>
      <view>企业邮箱：<span>{{ company.email }}</span></view>
    </uni-card>

    <!-- 关联订单信息-->
    <uni-card v-if="!!orderPay" title="关联订单信息" :is-shadow="false">
      <view>订单编号：<span>{{ orderPay.number }}</span></view>
      <view>订单名称：<span>{{ orderPay.name }}</span></view>
      <view>支付类型：
        <template v-for="(item, index) in dicts.ec_order_pay_type">
          <template v-if="orderPay.payType == item.value">
            <span>{{ item.text }}</span>
          </template>
        </template>
      </view>
      <view>消费金额：
        <span v-if="orderPay.payType == 1"
              class="errorColor">{{ parseFloat(Number(orderPay.amount).toFixed(0)) + ' g 碳能量' }}</span>
        <span v-else class="themeColor">{{ orderPay.amount + ' 元' }}</span>
      </view>
      <view>订单状态：
        <template v-for="(item, index) in dicts.ec_order_status">
          <template v-if="orderPay.status == item.value">
            <uni-tag size="small" :text="item.text" :type="item.type"/>
          </template>
        </template>
      </view>
      <view>下单人：<span>{{ orderPay.orderPersonName }}</span></view>
      <view>支付人：<span>{{ orderPay.payerName }}</span></view>
      <view>交易时间：<span>{{ orderPay.createTime }}</span></view>
      <view>支付时间：<span>{{ orderPay.payTime }}</span></view>
    </uni-card>

    <!-- 关联合同信息-->
    <uni-card v-if="!!contract" title="关联合同信息" :is-shadow="false">
      <view>合同编号：<span>{{ contract.contractNumber }}</span></view>
      <view>合同名称：<span>{{ contract.name }}</span></view>
      <view>签署状态：
        <template v-for="(item, index) in dicts.ec_contract_status">
          <template v-if="contract.status == item.value">
            <uni-tag size="small" :text="item.text" :type="item.type"/>
          </template>
        </template>
      </view>
      <view>发起时间：<span>{{ contract.createTime }}</span></view>
      <view>截止时间：<span>{{ contract.signExpiryDate }}</span></view>
      <view>合同备注：<span v-if="contract.remark != ''">{{ contract.remark }}</span>
	  <span v-else>暂无</span>
	  </view>
    </uni-card>

  </view>
</template>

<script>
import {getOrderPay} from "@/api/ec/person/fee/orderPay";
import {getDictsByNameForUni} from "../../../../utils/dicts";
import {getStaffIntegralRecord} from "../../../../api/ec/person/fee/integralRecord";
import {getCompany} from "../../../../api/ec/work/company/company";
import {getContract} from "../../../../api/ec/work/contract/contract";

export default {
  data() {
    return {
      // 数据字典
      dicts: {
        // 支付类型
        ec_change_type: [],
        // 交易渠道
        ec_integral_trading_channel: [],
        // 支付类型
        ec_order_pay_type: [],
        // 订单状态
        ec_order_status: [],
        // 合同签署状态
        ec_contract_status: [],
      },
      // 详情数据
      dataDetails: {},
      // 关联订单信息
      orderPay: null,
      // 关联企业信息遮罩层
      companyLoading: false,
      // 关联企业信息信息
      company: null,
      // 关联合同信息遮罩层
      contractLoading: false,
      // 关联合同信息
      contract: null,
    }
  },
  onLoad(option) {
    this.dataDetails = JSON.parse(option.signFlowFeeOrder)
    // 加载字典数据
    this.getDicts()
  },
  created() {
    // 获取订单详情
    this.getRecordDetails();
    if (this.dataDetails.companyId != null && this.dataDetails.companyId != 0) {
      this.getCompanyInfo(this.dataDetails.companyId);
    }
    let channel = this.dataDetails.channel;
    if (channel == 1 || channel == 2) {
      // 个人、企业注册：无
    } else if (channel == 3 || channel == 4) {
      // 个人、企业范本服务：关联订单
      this.getOrderPayInfo(this.dataDetails.orderId);
    } else if (channel == 5 || channel == 6) {
      // 个人、企业签约：关联合同
      this.getContractInfo(this.dataDetails.contractId);
    } else if (channel == 7 || channel == 8) {
      // 个人、企业分享推荐：无
    } else {
      // 其他：关联订单
      this.getOrderPayInfo(this.dataDetails.orderId);
    }
  },
  methods: {
    // ===============================================================================================================
    // ==== 加载数据字典
    // ===============================================================================================================
    /**加载数据字典*/
    getDicts() {
      // 支付类型
      this.dicts.ec_change_type = getDictsByNameForUni("ec_change_type");
      // 交易渠道
      this.dicts.ec_integral_trading_channel = getDictsByNameForUni("ec_integral_trading_channel");
      // 支付类型
      this.dicts.ec_order_pay_type = getDictsByNameForUni("ec_order_pay_type");
      // 订单状态
      this.dicts.ec_order_status = getDictsByNameForUni("ec_order_status");
      // 合同签署状态
      this.dicts.ec_contract_status = getDictsByNameForUni("ec_contract_status");
    },
    /** 获取订单详情 */
    getRecordDetails() {
      getStaffIntegralRecord(this.dataDetails.id).then(response => {
        this.dataDetails = response.data;
      });
    },
    /** 查询订单详细 */
    getOrderPayInfo(orderId) {
      this.$modal.loading();
      getOrderPay(orderId).then(response => {
        uni.hideLoading()
        this.orderPay = response.data;
      }).catch(() => {
        uni.hideLoading()
      });
    },
    /** 查询企业详细 */
    getCompanyInfo(companyId) {
      getCompany(companyId).then(response => {
        this.company = response.data;
      });
    },
    /** 查询合同详细 */
    getContractInfo(contractId) {
      this.$modal.loading();
      getContract(contractId).then(response => {
        uni.hideLoading()
        this.contract = response.data;
      }).catch(() => {
        uni.hideLoading()
      });
    },
  }
}
</script>

<style lang="scss" scoped>
::v-deep .uni-collapse-item__title-box {
  background: #fff;
  padding: 0;
}

::v-deep .uniui-bottom {
  color: #ccc !important;
}

page {
  background: $uni-bg-color;
}

view {
  margin-bottom: 10rpx;
}

.common-money {
  font-size: 40rpx;
  font-family: PingFangSC-Semibold, PingFang SC;
  font-weight: 600;
  line-height: 40rpx;
  margin-right: 15rpx;
}
</style>
